<script setup>
import {ref,reactive,defineProps} from "vue"

let props = defineProps({
    background:{
        type:String,
        default:'#ececec'
    },
    backgroundColor:{
        type:String,
        default:'#fff'
    },
    isWidth:{
        type:Boolean,
        default:true
    }
})

</script>
<template>
  <div class="jc-swiper-slide-template" :style="{background:props.background,backgroundColor:props.backgroundColor}">
    <div :class="[props.isWidth ? 'jc-center-width':'full-width']">
        <slot></slot>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.jc-swiper-slide-template {
    width: 100%;
    height: 100vh;
    // background: #e40001 no-repeat 80%/contain;
    background-position: center center;
    background-color: var(--jc-color-primary);
    .jc-center-width {
        height: 100%;
    }
    .full-width {
        width: 100%;
        height: 100%;
    }
}
</style>
